﻿<%@ Page Title="Product Details" Language="C#" MasterPageFile="~/ProductMaster.master" AutoEventWireup="true" CodeBehind="ProductDetails.aspx.cs" Inherits="ShopOnline.ProductInfo" Theme="ShopOnline" %>

<%@ Register Src="~/Controls/ShopOnline/ProductDetails.ascx" TagName="ProductDetails" TagPrefix="uc" %>
<%@ Register Src="~/Controls/ShopOnline/ProductListCtrl.ascx" TagName="ProductList" TagPrefix="uc" %>

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <style>
        .tag
        {
            cursor:pointer;
            margin-right: 5px;
        }
    
        .tagTextBox
        {
            background-image:url(../images/tag-input.png);
            background-repeat:no-repeat;
            padding-left:5px;
            padding-top:4px;
            padding-bottom:4px;
            width:400px;
        }
    
        .tagTextBox input[type=text]
        {
            border: 0px none transparent;
            width:380px;
        }
    </style>

    <script type="text/javascript">
        function addVerticalDivider() {
            var count = $('.products-grid .item').length;
            $('.products-grid .item').each(function () {
                var index = $(this).attr('index');
                if (index < count - 1)
                    $(this).css('border-right', '1px dotted #d2d2d2');
            });


        }
    </script>

    <uc:ProductDetails ID="prdDetails" runat="server" OnCartChanged="prdDetails_OnCartChanged" ></uc:ProductDetails>

    <div id='divRelated' runat="server" style='border-top:1px dotted #d2d2d2; margin-top: 20px; padding-top:20px'>
        <asp:Label runat="server" Font-Bold="true" style='font-size:14px;' Text="You may also be interested in the following product(s):"></asp:Label>
        <div style='height:10px'>&nbsp;</div>
        <uc:ProductList ID="productList" runat="server" RepeatDirection="Horizontal" RepeatLayout="Flow" RepeatedColumns="3"
                AllowPaging="false" OnNeedDataSource="productList_OnNeedDataSource" Width="100%" OnCartChanged="productList_OnCartChanged" />
    </div>

    <div style='border-top:1px dotted #d2d2d2; margin-top: 20px; padding-top:20px; clear:both; padding-bottom:20px'>
        <asp:Label Font-Bold="true" style='font-size:14px;' ID="Label4" runat="server">Tags: </asp:Label>
        <asp:Literal ID="litTags" runat="server" ></asp:Literal>

        <div style='width:100%'>
            <div style='height:5px'> &nbsp;</div>
            <table>
                <tr>
                    <td valign="top">
                        <div class='tagTextBox'>
                            <asp:TextBox ID="txtTag" runat="server" class='input-text'></asp:TextBox>
                        </div>
                        <p class="note" style='font-size:9px'>
                            Use spaces to separate tags.
                        </p>
                    </td>
                    <td valign="top">
                        <button id="btnTag" type="button" runat="server" onserverclick="btnTag_OnClick" class="button btn-cart">
                            <span><span>Your Tag</span></span></button>
                    </td>
                </tr>
            </table>
        </div>
    </div>
</asp:Content>
